*,
*:after,
*:before {
    font-weight: 300;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
p,
figure,
form,
ul,
ol {
    margin: 0
}

ul,
ol,
input,
button {
    padding: 0
}

ul,
ol,
li {
    list-style: none
}

h1,
h2,
h3,
h4,
h5 {
    font-size: 100%
}

input {
    border: 0;
    margin: 0
}

a,
button,
input,
optgroup,
select,
textarea,
img {
    outline: none;
    -webkit-tap-highlight-color: transparent
}

a,
img {
    -webkit-touch-callout: none;
    border: 0
}

html {
    overflow-x: hidden
}

input,
textarea,
img,
button {
    vertical-align: middle;
    outline: none;
    -webkit-appearance: none
}

body {
    font: normal 12px/1 '\5FAE\8F6F\96C5\9ED1', Helvetica, STHeiTi, sans-serif;
    color: #333;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased
}

a {
    text-decoration: none;
    color: #333
}

a:hover {
    text-decoration: none
}

.fl {
    float: left
}

.fr {
    float: right
}

.clearfix {
    zoom: 1
}

.clearfix:before,
.clearfix:after {
    content: "";
    display: table
}

.clearfix:after {
    clear: both
}

.nodis {
    display: none
}

@media all and (min-width: 320px) {
    html {
        font-size: 10px
    }
}

@media all and (min-width: 360px) {
    html {
        font-size: 11.25px
    }
}

@media all and (min-width: 375px) {
    html {
        font-size: 11.7188px
    }
}

@media all and (min-width: 480px) {
    html {
        font-size: 15px
    }
}

@media all and (min-width: 640px) {
    html {
        font-size: 20px
    }
}

@media all and (min-width: 720px) {
    html {
        font-size: 22.5px
    }
}

html {
    font-family: "Microsoft Yahei", "\5FAE\8F6F\96C5\9ED1"
}

body {
    background-color: #f7f7f7
}

.main {
    margin: 0 auto;
    width: 1000px
}

.head {
    height: 80px;
    background-color: #35a7ff
}

.head .logo-area {
    float: left
}

.head .logo-area h1 {
    float: left;
    margin-top: 14px;
    width: 161px;
    height: 52px;
    font-size: 0;
    line-height: 0;
    background: url(img/logo.png?7d1f0069efa515fe306ea8fd8bb3f5c1) 50% 50% no-repeat;
    overflow: hidden
}

.head .logo-area h2 {
    display: inline;
    float: left;
    margin-top: 16px;
    margin-left: 15px;
    padding: 15px 0 0 15px;
    height: 50px;
    color: #fff;
    font-size: 24px;
    border-left: 1px solid #fff
}

.mid-cont {
    margin-top: 25px;
    background-color: rgba(255, 255, 255, 0.69);
    background-color: #fff\9;
    border: 2px solid #f0f0f0
}

.mid-cont .mid-cont-inner {
    padding: 0 20px
}

.mid-cont .mid-cont-inner .pay-tit {
    height: 66px;
    line-height: 66px;
    border-bottom: 1px dashed #d9d9d9
}

.mid-cont .mid-cont-inner .pay-tit.no-botborder {
    border-bottom: none
}

.mid-cont .mid-cont-inner .pay-tit .pay-logo {
    padding-left: 10px
}

.mid-cont .mid-cont-inner .pay-tit .pay-money {
    padding-top: 22px;
    font-size: 14px;
    color: #333
}

.mid-cont .mid-cont-inner .pay-tit .pay-money em {
    padding-left: 10px;
    font-style: normal;
    font-size: 18px;
    color: #ff3131
}

.mid-cont .mid-cont-inner .bank-box li {
    position: relative;
    padding-left: 20px;
    cursor: pointer
}

.mid-cont .mid-cont-inner .bank-box li div {
    display: inline-block
}

.mid-cont .mid-cont-inner .bank-box li .bank-img {
    margin: 13px 20px 13px 10px;
    width: 200px;
    height: 50px;
    text-align: center;
    background-color: #fff;
    border: solid 1px #dcdcdc
}

.mid-cont .mid-cont-inner .bank-box li .bank-img img {
    margin-top: 12px
}

.mid-cont .mid-cont-inner .bank-box li .bank-type,
.mid-cont .mid-cont-inner .bank-box li .number {
    position: absolute;
    font-size: 14px
}

.mid-cont .mid-cont-inner .bank-box li .bank-type {
    margin-top: 26px;
    width: 55px;
    height: 24px;
    color: #fff;
    line-height: 24px;
    text-align: center;
    border-radius: 2px
}

.mid-cont .mid-cont-inner .bank-box li .debit {
    background-color: #acd0eb
}

.mid-cont .mid-cont-inner .bank-box li .credit {
    background-color: #fabd18
}

.mid-cont .mid-cont-inner .bank-box li .number {
    position: absolute;
    line-height: 76px;
    margin-left: 70px
}

.mid-cont .mid-cont-inner .bank-box li .money {
    display: none;
    position: absolute;
    top: 0;
    right: 65px;
    color: #666;
    bottom: 0;
    line-height: 76px;
    font-weight: 700;
    font-size: 18px
}

.mid-cont .mid-cont-inner .bank-box li .money span {
    color: #ff3131;
    font-weight: 700;
    font-size: 24px
}

.mid-cont .mid-cont-inner .bank-box .selected {
    border: 1px solid #aed7ff
}

.mid-cont .mid-cont-inner .bank-box .selected .bank-img {
    border-color: #fa9600;
    background-color: #fff6e1
}

.mid-cont .mid-cont-inner .bank-box .selected .money {
    display: block
}

.mid-cont .mid-cont-inner .hasbankcard {
    height: 55px;
    line-height: 55px;
    font-size: 16px;
    color: #333
}

.mid-cont .mid-cont-inner .has-more {
    background-color: #f7fbff
}

.mid-cont .mid-cont-inner .has-more ul {
    height: 78px;
    overflow: hidden
}

.mid-cont .mid-cont-inner .has-more li {
    border: 1px solid #f7fbff;
    padding-left: 35px
}

.mid-cont .mid-cont-inner .has-more li label {
    display: block;
    cursor: pointer
}

.mid-cont .mid-cont-inner .has-more li input {
    position: absolute;
    top: 30px;
    left: 20px;
    margin-right: 20px;
    -webkit-appearance: radio
}

.mid-cont .mid-cont-inner .add-bank,
.mid-cont .mid-cont-inner .choose-other-bank {
    vertical-align: top;
    display: inline-block;
    margin-top: 26px;
    margin-bottom: 30px;
    width: 100px;
    height: 32px;
    text-align: center;
    line-height: 26px;
    color: #35a7ff;
    border: dashed 1px #d9d9d9;
    cursor: pointer
}

.mid-cont .mid-cont-inner .add-bank strong,
.mid-cont .mid-cont-inner .choose-other-bank strong {
    font-size: 22px;
    font-weight: 200;
    vertical-align: -1px
}

.mid-cont .mid-cont-inner .choose-other-bank {
    display: inline-block;
    border-style: solid;
    margin-right: 30px;
    border-color: #35a7ff;
    line-height: 32px
}

.mid-cont .mid-cont-inner .botline {
    border-bottom: 1px dashed #d9d9d9
}

.mask-layer {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.35);
    background-color: #000;
    opacity: .35;
    filter: Alpha(opacity=35)
}

.pop-layer {
    display: none;
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 999;
    background-color: #fff;
    border: 4px solid rgba(0, 80, 153, 0.3)
}

.pop-layer .pop-tit {
    position: relative;
    height: 45px;
    line-height: 45px;
    background-color: #f0fbff;
    border-bottom: solid 1px #acd0eb
}

.pop-layer .pop-tit h5 {
    padding-left: 20px;
    font-size: 16px;
    font-weight: 700;
    color: #999
}

.pop-layer .pop-tit button {
    position: absolute;
    right: 13px;
    top: 7px;
    width: 30px;
    height: 30px;
    line-height: 0;
    font-size: 0;
    background: url() 50% 50% no-repeat;
    border: 0;
    overflow: hidden;
    cursor: pointer
}

.pop-layer .pop-cont p {
    margin-top: 38px;
    font-size: 14px;
    text-align: center;
    line-height: 1;
    color: #6d6d6d
}

.pop-layer .pop-cont p strong {
    display: block;
    margin-bottom: 18px;
    font-size: 18px;
    color: #535252
}

.pop-layer .pop-cont .pop-btns {
    margin-top: 38px;
    text-align: center
}

.pop-layer .pop-cont .pop-btns button {
    margin: 0 13px;
    width: 129px;
    height: 38px;
    font-size: 16px;
    line-height: 38px;
    border: 0;
    border-radius: 3px;
    cursor: pointer
}

.pop-layer .pop-cont .pop-btns button.pay-success-btn {
    color: #fff;
    background-color: #35a7ff
}

.pop-layer .pop-cont .pop-btns button.pay-erros-btn {
    color: #6d6d6d;
    background-color: #e6edf3;
    border: solid 1px #dedede
}

.pop-layer .pop-cont .pro,
.pop-layer .pop-cont .ft-btn {
    margin-top: 25px
}

.pop-layer .pop-cont .ft-btn {
    bottom: 20px;
    font-size: 14px;
    color: #35a7ff;
    cursor: pointer
}

#smsPrompt {
    margin: -142px 0 0 -350px;
    width: 700px
}

#smsPrompt .smsMsgs {
    background: url(img/noSms.png?4fb550a7ba8c553cb249342d1d673379) no-repeat;
    margin: 20px 30px 32px
}

#smsPrompt .smsMsgs div {
    padding-left: 35px
}

#smsPrompt .smsMsgs div strong {
    font-size: 20px;
    line-height: 26px
}

#smsPrompt .smsMsgs div p {
    margin-top: 12px;
    font-size: 16px;
    line-height: 25px;
    text-align: left
}

#smsPrompt .smsMsgs div span {
    font-size: 14px;
    line-height: 30px;
    color: #7c7c7c
}

#payProtocol {
    margin-top: -205px;
    margin-left: -400px;
    width: 800px;
    height: 410px
}

#payProtocol .protocol-cont {
    padding: 30px;
    height: 357px;
    overflow-y: auto
}

#payProtocol .protocol-cont h3 {
    padding-bottom: 15px;
    font-size: 16px
}

#payProtocol .protocol-cont p {
    margin-top: 0;
    padding-bottom: 10px;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    text-indent: 2em
}

.footer {
    height: 90px;
    font-size: 14px;
    line-height: 90px;
    text-align: center;
    color: #bcbbbb
}

.order {
    position: relative;
    padding-top: 30px;
    line-height: 20px
}

.order .order-intro h3 {
    vertical-align: top;
    display: inline-block;
    margin-right: 10px;
    padding-left: 2px;
    font-weight: normal;
    font-size: 20px;
    white-space: nowrap;
    color: #474747
}

.order .order-intro .detail {
    vertical-align: top;
    display: inline-block;
    font-size: 16px;
    color: #35a7ff;
    position: relative;
    padding-right: 16px
}

.order .order-intro .detail span {
    position: absolute;
    right: 0;
    width: 0;
    height: 0;
    font-size: 0;
    overflow: hidden;
    border: 5px solid transparent
}

.order .order-intro .close span {
    border-left: 7px solid #35a7ff;
    top: 50%;
    margin-top: -5px
}

.order .order-intro .open span {
    border: 5px solid transparent;
    border-top: 7px solid #35a7ff;
    margin-top: 6px
}

.order .order-amount {
    position: absolute;
    top: 44px;
    right: 2px;
    color: #666;
    font-weight: 700;
    font-size: 18px
}

.order .order-amount span {
    color: #ff3131;
    font-weight: 700;
    font-size: 24px
}

.order .order-detail {
    display: none;
    padding-top: 8px
}

.order .order-detail li {
    font-size: 16px;
    line-height: 24px;
    color: #333
}

.order .order-detail li span {
    font-weight: normal;
    color: #666
}

.progress ul {
    border-top: 4px solid #c9c9c9;
    margin-top: 62px;
    position: relative
}

.progress ul:before {
    -webkit-transition: all .6s ease;
    transition: all .6s ease
}

.progress ul li {
    float: left;
    width: 33.3333%;
    text-align: center;
    position: relative;
    padding-top: 34px;
    font-size: 18px;
    font-weight: 700;
    color: #c9c9c9
}

.progress ul li:before {
    position: absolute;
    content: '';
    left: 50%;
    top: -14px;
    margin-left: -14px;
    width: 24px;
    height: 24px;
    border: 4px solid #c9c9c9;
    box-shadow: 0 0 0 3px #f7f7f7;
    border-radius: 100%;
    background-color: #fff
}

.progress ul.cur:before {
    position: absolute;
    content: '';
    left: 0;
    top: -4px;
    height: 4px;
    line-height: 0;
    font-size: 0;
    overflow: hidden;
    width: 66.6666%;
    background-color: #90da6d
}

.progress ul.cur li:nth-child(1) {
    color: #90da6d
}

.progress ul.cur li:nth-child(1):before {
    border-color: #90da6d
}

.progress ul.cur li:nth-child(2) {
    color: #90da6d
}

.progress ul.cur li:nth-child(2):before {
    border-color: #90da6d
}

.progress ul.all:before {
    position: absolute;
    content: '';
    left: 0;
    top: -4px;
    height: 4px;
    line-height: 0;
    font-size: 0;
    overflow: hidden;
    width: 100%;
    background-color: #90da6d
}

.progress ul.all li:nth-child(1),
.progress ul.all li:nth-child(2),
.progress ul.all li:nth-child(3) {
    color: #90da6d
}

.progress ul.all li:nth-child(1):before,
.progress ul.all li:nth-child(2):before,
.progress ul.all li:nth-child(3):before {
    border-color: #90da6d
}

.pay-result {
    padding-top: 30px;
    padding-bottom: 30px
}

.pay-result h4 {
    margin-bottom: 30px;
    padding-left: 40px;
    height: 30px;
    font-size: 18px;
    line-height: 30px;
    color: #333;
    background: url("/images/icon-status.png") no-repeat 0 0;
}

.pay-result.process h4 {
    background-position: 0 0;
}

.pay-result.suc h4 {
    background-position: 0 -40px;
}

.pay-result.fail h4 {
    background-position: 0 -80px;
}

.pay-result .order-info {
    padding: 18px 30px;
    background-color: #f7f7f7
}

.pay-result .order-info p {
    font-size: 16px;
    line-height: 40px;
    color: #333
}

.pay-result .order-info p strong {
    display: inline-block;
    width: 90px;
    text-align: right
}